<template>
  <div class="px-4 py-4">
    <el-card class="h-[100%] w-[100%]" shadow="never">
      <template v-if="showheader" #header>
        <div class="flex justify-between">
          <div>{{ title }}</div>
          <!-- <div class="mr-[100px]">
            <el-button size="small" type="primary" @click="handleClick">
              {{ buttonname }}
            </el-button>
          </div> -->
        </div>
      </template>
      <div>
        <slot></slot>
      </div>
    </el-card>
  </div>
</template>

<script setup lang="ts">
// // 定义 emit 类型
// interface Emit {
//   (e: 'confirm-handle', data: { message: string }): void;
// }

defineProps({
  // 是否显示头部
  showheader: {
    type: Boolean,
    default: true,
  },
  // 标题名称
  title: {
    type: String,
    default: '',
  },
  // // 按钮名称
  // buttonname: {
  //   type: String,
  //   default: '',
  // },
});

// // 创建 emit 函数
// const emit = defineEmits<Emit>();

// // 创建一个函数来处理按钮点击事件
// const handleClick = () => {
//   // eslint-disable-next-line vue/custom-event-name-casing
//   emit('confirm-handle', { message: 'Hello from YCard!' });
// };
</script>

<style scoped lang="scss"></style>
